<!--
 * @Descripttion: 出手鸭小程序
 * @version:1.0.1 
 * @Author: HHL
 * @Date: 2023-10-08 09:53:29
 * @LastEditTime: 2025-09-17 20:20:32
 * @LastEditors: sueRimn
-->

<template>
	<view class="user-info d-flex justify-content-between align-items-center">
		<view class="d-flex align-items-center">
			<view class="head-img">
				<image class="avatar-icon" src="@/static/images/my/avatar_default.png"
					@click="goLogin" />
			</view>
			<view class="info">
				<view class="login" v-if="!userInfo.userId" @click="goLogin">登录/注册</view>
				<view v-else>
					<view class="text">用户编号：{{ userInfo.userId }}</view>
					<view class="text">{{ hidePhoneNumber(userInfo.userPhone) || '' }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getAuthUserInfo
	} from '@/api'
	import {
		BASEHOST
	} from '@/config'
	import {
		parseTime
	} from '@/utils'

	export default {
		props: {
			userInfo: {
				type: Object
			}
		},

		methods: {
			goLogin() {
				if (this.userInfo.userId) return
				this.$emit('checkAuth')
			},

			// 选择图片回调
			onChooseavatar(e) {
				const {
					avatarUrl
				} = e.detail
				if (avatarUrl) {
					// this.uploadImage(avatarUrl)
				}
			},

			// 上传图片
			uploadImage(img) {
				try {
					uni.showLoading({
						title: '正在更新头像',
						mask: true
					})
					uni.uploadFile({
						url: `${BASEHOST}/ajhuishou-manager/common/fileUpload/liteUploadImage`,
						fileType: 'image',
						filePath: img,
						name: 'file',
						header: {
							'wzw-client-type': 'weapp-lite',
							'wzw-access-token': getApp().globalData.token,
						},
						formData: {
							'folderPath': `userAvatar/${parseTime(new Date(), '{y}{m}{d}')}`,
						},
						success: ({
							data
						}) => {
							const res = JSON.parse(data)
							if (res.code === 200 && res.data) {
								getAuthUserInfo({
									avatar: res.data
								}).then(data => {
									if (data.code === 200) {
										this.$store.dispatch('loadUserInfo')
									}
								})
							}
						},
					})
				} finally {}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.user-info {
		// #ifndef H5
		padding: 10rpx 32rpx 48rpx;
		// #endif

		// #ifdef MP-ALIPAY
		padding: 32rpx 32rpx 48rpx;
		// #endif

		// #ifdef H5
		padding: 32rpx 32rpx 48rpx;
		// #endif

		position: relative;
		margin-top: 45rpx;

		.head-img {
			position: relative;
			border-radius: 50%;

			.avatar-icon {
				width: 116rpx;
				height: 116rpx;
				display: block;
				border-radius: 50%;
				margin: 0 auto;
			}

			.btn {
				position: absolute;
				bottom: 0;
				left: 0;
				width: 98rpx;
				font-size: 14rpx;
				line-height: 22rpx;
				color: #BF2C30;
				text-align: center;
				background: #fff;
				border-radius: 11rpx;
			}

			.click-btn {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				background: transparent;
			}
		}

		.info {
			padding-left: 24rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			color: #333;

			.text {
				font-size: 28rpx;
				font-weight: 500;
				line-height: 48rpx;
			}

			.login {
				font-size: 32rpx;
				font-weight: 500;
			}
		}

		.wallet {
			padding: 16rpx 52rpx 0 0;
			width: 224rpx;
			height: 68rpx;
			background: rgba(0, 0, 0, 0.1);
			border-radius: 34rpx;
			padding: 0 0 0 32rpx;

			.text {
				font-size: var(--hui-font-size-26);
				color: #fff;
				padding: 0 0 0 10rpx;
			}
		}
	}
</style>